{#
/**
 * @file
 * Grid component
 *
 * See component.wingsuit.yml for usage.
 */
#}
{# SETTINGS #}
{% set columns = columns|default(2) %}
{% set columns_width = columns_width|default('equal') %}

{# Gap #}
{% set gutter = gutter|default('default') %}
{% set gutter_classes = pattern_configuration('grid', '', 'gutter')[gutter] %}
{# Container #}
{% set configuration = pattern_configuration('grid', '', 'columns')[columns][columns_width] %}

{% set vertical_center = vertical_center|default(false) %}
{% set equal_height = vertical_center == true ? true: equal_height %}

{% set classes = ([
  'grid',
  configuration,
  gutter_classes,
]) | sort | join(' ') | trim %}

{% set attributes = attributes|default(create_attribute()).addClass(classes) %}

{# TEMPLATE #}
{% if configuration is not empty %}
  <div {{ attributes }}>
    {% block cells %}
      {% for cell_counter, cell in cells %}
        {% block cell_outer %}
          {% set column_name = 'column_' ~ (cell_counter + 1) %}
          {% set cell_classes = [
            flip_mobile == '1' and cell_counter == '1' ? 'row-start-1 lg:row-start-auto',
            equal_height == true ? 'flex flex-col',
            vertical_center == true ? 'justify-center',
          ]
          %}
          {% set cell_attributes = region_attributes[column_name]|default(create_attribute()).addClass(cell_classes | sort) %}

          <div{{ cell_attributes }}>
            {% block cell_inner %}
              {{ cell }}
            {% endblock %}
          </div>
        {% endblock %}
      {%- endfor -%}
    {% endblock %}
  </div>
{% else %}
  No configuration found for "{{ columns }}/{{ config }}".
{% endif %}
